import InfoBarList from '../InfoBarList/InfoBarList';

const backgroundId = 'e9424af07d8242adb4fa49abe40544b4';
const topId = '05ad118feea64a349fb2e9fd3eba730b';

function flyTo(map, coordinate) {
    map.flyTo({
        center: coordinate,
        zoom: 13
    });
}

export default class TemperatureHandler {
    constructor() {
        this.chart = null;
        this.infoObjArr = [];
        this.legendObj = {
            name: '温度',
            arrName: ['<10', '10-20', '20-30', '>30'],
            arrColor: ['rgb(230, 245, 190)', 'rgb(254, 224, 139)', 'rgb(244, 108, 67)', 'rgb(213, 62, 80)']
        };
        this.num = 0;
        this.visible = false;
    }

    loadData(map, isInitChart) {
        let that = this;
        minemap.util.getJSON('../data/xianTemNew.json', function (error, data) {
            data = data ? data : {};
            for (let i = 0; i < 24; i++) {
                const infoObj = {
                    "color1": "#FEC819",
                    "color2": "#00C0CE",
                    "unit": "温度（℃）",
                    "array": [],
                    callback: flyTo.bind(null, map)
                };
                data[i].features.map((item) => {
                    infoObj.array.push({
                        "name": item.properties.name,
                        "value": item.properties.tem,
                        "coordinate": item.geometry.coordinates[Math.ceil(item.geometry.coordinates.length / 2)]
                    })
                });
                that.infoObjArr.push(infoObj);
            }
            if (isInitChart) {
                that.updateChart();
            }
        });
    }

    updateChart() {
        this.chart = new InfoBarList('road-weather-chart', this.infoObjArr[this.num] || {}, 37);
    }

    getInfoObj() {
        return this.infoObj;
    }

    getChart() {
        return this.chart;
    }

    getLegendObj() {
        return this.legendObj;
    }

    setValueNum(map, valueNum) {
        if (this.visible) {
            map.moveLayer('tem' + this.num, backgroundId);
            this.num = valueNum;
            map.moveLayer('tem' + valueNum, topId);
        } else {
            this.num = valueNum;
        }
        if (this.num !== 24) this.updateChart();
    }

    setVisible(map) {
        if(!this.visible) {
            for (let i = 0; i < 25; i++) {
                map.setLayoutProperty('tem' + i, 'visibility', 'visible');
            }
            map.moveLayer('tem' + this.num, topId);
            this.visible = true;
        }
    }

    setUnvisible(map) {
        if (this.visible) {
            for (let i = 0; i < 25; i++) {
                map.setLayoutProperty('tem' + i, 'visibility', 'none');
            }
            map.moveLayer('tem' + this.num, backgroundId);
            this.visible = false;
        }
    }
};